<template>
	<view>
		<view class="head">
			<swiper class="banner" :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
				<swiper-item>
					<view class="swiper-item">
						<image class="img" src="../../static/shop/1595833354066324005.jpg" mode=""></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image class="img" src="../../static/shop/1595833443068049276.jpg" mode=""></image>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<view class="row1">
			<view class="list">
				<view class="li" @click="zhengce">
					<view class="text">
						· 杭州、无锡出台楼市调控政策 热点城市...
					</view>
					<view class="icon">
						<image class="img" src="../../static/icon/iconRight.png" mode=""></image>
					</view>
				</view>
				<view class="li">
					<view class="text">
						· 杭州、无锡出台楼市调控政策 热点城市...
					</view>
					<view class="icon">
						<image class="img" src="../../static/icon/iconRight.png" mode=""></image>
					</view>
				</view>
				<view class="li">
					<view class="text">
						· 杭州、无锡出台楼市调控政策 热点城市...
					</view>
					<view class="icon">
						<image class="img" src="../../static/icon/iconRight.png" mode=""></image>
					</view>
				</view>
				<view class="li">
					<view class="text">
						· 杭州、无锡出台楼市调控政策 热点城市...
					</view>
					<view class="icon">
						<image class="img" src="../../static/icon/iconRight.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<!-- 类型 -->
		<e-sort></e-sort>
		
		<view class="box">
			<house-list1></house-list1>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				flag1: false
			};
		},
		methods:{
			zhengce(){
				uni.navigateTo({
					url:'/Estate/zhengCe/zhengCePage'
				})
			}
		}
	}
</script>

<style lang="scss">
	.banner {
		width: 85%;
		height: 300rpx;
		margin: auto;
		border-radius: 15rpx;

		.swiper-item {
			width: 100%;
			height: 300rpx;
			border-radius: 15rpx;

			image {
				border-radius: 15rpx;
			}
		}
	}

	.row1 {
		width: 80%;
		margin: auto;

		.image {
			width: 100%;
			height: 200rpx;
		}

		.list {
			$height: 50rpx;
			margin-top: 20rpx;

			.li {
				width: 100%;
				display: flex;
				justify-content: space-between;
				height: $height;

				.text {

					font-size: 28rpx;
					font-weight: normal;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					line-height: $height;
				}

				.icon {
					margin-left: 5rpx;
					line-height: $height;
					width: 15rpx;
					height: 25rpx;
				}
			}
		}
	}

	.state {
		display: flex;
		justify-content: space-around;
		margin-top: 30rpx;

		.list1 {

			display: flex;


			.tit {
				font-size: 30rpx;
				color: #999999;
			}

			.span {
				display: flex;
				flex-direction: column;
				padding-left: 8rpx;
				
				
				text {
					width: 15rpx;
					height: 10rpx;
					font-size: 14rpx;
					color: #bbb;
				}
			}

		}

	}
	.box{
		width: 85%;
		margin: 30rpx auto;
	}
</style>
